import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import tailwindcss from "tailwindcss";
import autoprefixer from "autoprefixer";
import { resolve } from "path";
import  { createSvgIconsPlugin } from "vite-plugin-svg-icons"
 // 引入svg图标插件
 // 引入 unplugin icon
 import Icons from 'unplugin-icons/vite'

// 自动导入组件
import AutoImport from 'unplugin-auto-import/vite' 
// 自动导入src/components中的组件
import Components from 'unplugin-vue-components/vite'
//  Element Plus 解析器 自动导入element plus 的组件
import { ElementPlusResolver } from 'unplugin-vue-components/resolvers'
// https://vite.dev/config/
export default defineConfig({
  resolve: {
    alias: {
      '@': resolve(__dirname, 'src')
    }
  },
  plugins: [
    vue(),
    AutoImport({
      // 自动导入 Element Plus
      resolvers: [ElementPlusResolver()],
  }),
  //vue 组件自动导入
  Components({
      resolvers: [ElementPlusResolver()],
  }),
  createSvgIconsPlugin({
    iconDirs: [resolve(process.cwd(), 'src/icons/svg')],  // SVG 图标存放目录
    symbolId: 'icon-[dir]-[name]',
  }),
  Icons({
    autoInstall: true,
  }),

  ],
  css: {
    postcss: {
        plugins: [tailwindcss, autoprefixer]
    },
  },
  // 添加css 预处理器

  server: {
    port: 8080, // 配置前端项目启动端口
    host: "0.0.0.0",
    https: false,
    open: true, // 启动后自动打开浏览器
    // 热更新
    hmr: {
      overlay: false,
    },
    proxy: {
      // 本地后端代理
      "/api": {
        //要访问的跨域的域名
        target: "http://localhost:8888",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, ""),
      },
      // minio 代理
      "/blog-images": {
        target: "http://mrzym.top:9000/blog-images",
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/blog-images/, ""),
      },
    },
    // 打包输出
    build: {
      sourcemap: false,
      // 消除打包大小超过500kb警告
      chunkSizeWarningLimit: 4000,
      rollupOptions: {
        input: {
          index: resolve("index.html"),
        },
        // 静态资源分类打包
        output: {
          chunkFileNames: "static/js/[name]-[hash].js",
          entryFileNames: "static/js/[name]-[hash].js",
          assetFileNames: "static/[ext]/[name]-[hash].[ext]",
        },
      },
    },
  },
});
